<template>
	<view>
		<!-- 1，主要内容 -->
		<view class="more-box" v-for="(item,index) in setList" :key="index">
			<view class="more-box-con-active" v-if="!item.isSwitch">
				<view class="more-content" @click="clickMore(item)">
					<view class="more-text">
						<text>{{item.title}}</text>
					</view>
					<view class="more-img">
						<image :src="item.head"></image>
					</view>
				</view>
			</view>
			<view class="more-box-con" v-else>
				<view class="more-content" @click="clickMore(item)">
					<view class="more-text">
						<text>{{item.title}}</text>
					</view>
					<view class="more-switch">
						<switch :checked="item.chatIsSwitch" color="#108EE9" style="transform: scale(0.7)"
							@click="switchChange(item)" />
					</view>
				</view>
			</view>
		</view>

		<!-- 2，删除按钮 -->
		<view class="bottom-btn">
			<view class="btn" @click="deleteFriend">
				<text>删除好友</text>
			</view>
		</view>

		<!-- 修改备注弹框 -->
		<my-update-animation :isDetermine="false" :share="isShowUpdate" :title="title" @display="display"
			@submitText="changeNickname">
		</my-update-animation>
	</view>
</template>

<script>
	//引入js文件
	import {
		setListData
	} from './set-user.js'

	import {
		updateFriendRemarks,
		deleteFriendRemarks
	} from '@/api/http/msg/friend.js'

	import {
		addBlackUser,
		queryIsBlack
	} from '@/api/http/msg/relation.js'

	import {
		mapState,
		mapMutations,
		mapActions
	} from 'vuex'

	import myUpdateAnimation from '@/components/common/my-update-animation/my-update-animation.vue'

	import {
		updateInfoData
	} from '@/object/msg.js'

	export default {
		components: {
			myUpdateAnimation
		},
		data() {
			return {
				//设置参数
				setList: [],
				msgObject: {},
				isShowUpdate: false,
				title: '设置备注',
				userId: uni.getStorageSync('userId')
			}
		},
		computed: {
			...mapState('m_chat', ['topUserData', 'notDisturbUserData'])
		},
		watch: {
			topUserData() {
				//console.log(213321412)
				for (var i = 0; i < this.topUserData.length; i++) {
					if (this.topUserData[i].id == this.msgObject.id && this.topUserData[i].type == this.msgObject.type) {
						this.setList[1].chatIsSwitch = true
						this.msgObject.isTop = true
						return
					}
				}
				this.setList[1].chatIsSwitch = false
				this.msgObject.isTop = false
			},
			notDisturbUserData() {
				//console.log(this.notDisturbUserData)
				for (var i = 0; i < this.notDisturbUserData.length; i++) {
					if (this.notDisturbUserData[i].id == this.msgObject.id && this.notDisturbUserData[i].type == this
						.msgObject.type) {
						this.setList[2].chatIsSwitch = true
						this.msgObject.isDisturb = true
						return
					}
				}
				this.setList[2].chatIsSwitch = false
				this.msgObject.isDisturb = false
			}
		},
		methods: {
			...mapActions('m_chat', ['msgGoTop', 'clearMsgByList', 'addChatData', 'clearLocalMsgList',
				'addDisturbUserList', 'updateInfo', 'removeFriendRemarks'
			]),
			...mapMutations('m_chat', ['getIsTop', 'getIsDisturb']),

			//1，获取switch状态
			getSwitchState() {
				//聊天置顶
				this.setList[1].chatIsSwitch = this.msgObject.isTop
				//消息免打扰
				this.setList[2].chatIsSwitch = this.msgObject.isDisturb

				//聊天置顶
				//this.setList[1].chatIsSwitch = this.getIsTop
				//消息免打扰
				//this.setList[2].chatIsSwitch = this.getIsDisturb
			},
			//2，点击Switch
			switchChange(e) {
				if (e.id == 2) {
					//聊天置顶
					return this.chatIsTop()
				} else if (e.id == 3) {
					//消息免打扰
					return this.disturbUser()
				} else if (e.id == 4) {
					//加入黑名单
					return this.addBlackUser(e)
				}
			},
			//2.1，聊天置顶
			chatIsTop() {
				this.msgGoTop(this.msgObject)
			},
			//2.2，聊天勿扰
			disturbUser() {
				this.addDisturbUserList(this.msgObject)
			},
			//3，点击更多更改按钮
			clickMore(e) {
				if (e.id == 1) {
					//设置备注
					return this.isShowAnimation()
				} else if (e.id == 5) {
					//清空聊天记录
					return this.cleanChatMsg()
				} else if (e.id == 6) {
					//投诉
					return uni.navigateTo({
						url: '/subpkg/msg/set/report/report'
					})
				}
			},
			//3.1，清空聊天记录
			async cleanChatMsg() {
				var that = this
				uni.$isShowModal('清空聊天记录将无法恢复！').then(resultState => {
					if (resultState) {
						that.clearLocalMsgList(that.msgObject)
						return uni.$showMsg('消息已被清空！');
					}
				})
			},
			//4，关闭弹框
			display() {
				this.isShowUpdate = false
			},
			//展示弹框
			isShowAnimation() {
				this.isShowUpdate = true
			},
			//5，更改备注
			changeNickname(e) {

				var relationObject = {
					id: this.msgObject.id,
					type: '2',
					friendRemarks: e
				}
				var that = this

				updateFriendRemarks(relationObject).then(res => {
					if (res.data.pubInfo.code !== 0) return uni.$showMsg(res.data.pubInfo.message)
					uni.$showMsg('修改成功！')
					//console.log(that.msgObject.id)
					if (e != '' && e != null) {
						//添加本地备注
						var updateData = updateInfoData(that.msgObject.id, 2, 1, e)

						that.updateInfo(updateData)
					} else {
						console.log('执行这条')
						//删除本地备注
						var updateData = updateInfoData(that.msgObject.id, 2, 1, res.data.busInfo)

						that.removeFriendRemarks(updateData)
					}


					that.isShowUpdate = false
				})
			},
			//6，删除好友
			deleteFriend() {
				var that = this
				uni.$isShowModal('是否删除好友？').then(resultState => {
					if (resultState) {
						deleteFriendRemarks(that.msgObject.id).then(res => {
							if (res.data.pubInfo.code !== 0) {
								if (res.data.pubInfo.message != '还未建立好友关系，请先添加好友！') {
									return uni.$showMsg(res.data.pubInfo.message)
								}
							}
							uni.$showMsg('删除好友成功！')
							//清空本地记录
							that.clearLocalMsgList(that.msgObject)
							//跳转消息页面
							uni.switchTab({
								url: "/pages/main/message/message"
							})
						})
					}
				})
			},
			//7，加入黑名单
			async addBlackUser(e) {
				var msgText = ''
				var changeType = '1'
				if (e.chatIsSwitch) {
					msgText = '是否取消对方黑名单？'
					changeType = '1'
				} else {
					msgText = '将对方加入黑名单?'
					changeType = '2'
				}
				var that = this
				uni.$isShowModal(msgText).then(resultState => {
					if (resultState) {
						addBlackUser(that.userId, that.msgObject.id, changeType).then(res => {
							if (res.data.pubInfo.code !== 0) {
								return uni.$showMsg(res.data.pubInfo.message)
							}
							that.queryIsBlack()
						})
					}
				})
			},
			queryIsBlack() {
				queryIsBlack(this.msgObject.id, this.userId).then(res => {
					if (res.data.pubInfo.code !== 0) {
						return uni.$showMsg(res.data.pubInfo.message)
					}
					if (res.data.busInfo == '2') {
						this.setList[3].chatIsSwitch = true
					} else {
						this.setList[3].chatIsSwitch = false
					}

				})
			}
		},
		onLoad(e) {
			//this.queryRelationState(e.userId, e.friendId)

			this.msgObject = JSON.parse(e.msgObject)
			//console.log(this.msgObject)
			this.setList = setListData

			this.getSwitchState()
			this.queryIsBlack()
		}
	}
</script>

<style scoped lang="scss">
	.more-box-con-active {
		width: 100%;

		&:active {
			background-color: #f3f3f3;
		}
	}

	.bottom-btn {
		position: fixed;
		z-index: 9;
		bottom: 0;
		left: 0;
		width: 100%;
		height: 120rpx;

		.btn {
			height: 80rpx;
			line-height: 80rpx;
			width: 80%;
			margin-left: 10%;
			background-color: rgba(247, 74, 115, 1);
			text-align: center;
			border-radius: 40rpx;

			text {
				font-size: 32rpx;
				font-weight: 400;
				color: rgba(255, 255, 255, 1);
			}
		}
	}

	.more-content {
		display: flex;
		width: 94%;
		margin-left: 3%;
		justify-content: space-between;
		height: 100rpx;
		line-height: 100rpx;

		.more-text {
			font-size: 32rpx;
		}

		.more-img {

			image {
				width: 50rpx;
				height: 50rpx;
				margin-top: 25rpx;
				margin-right: 20rpx;
			}

		}
	}
</style>